<html>

<head>
    <meta charset="utf-8">
    <title>快速注册</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta name="format-detection" content="telephone=no">
    <meta name="format-detection" content="email=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <link rel="stylesheet" type="text/css" href="css/public.css" />
    <link rel="stylesheet" type="text/css" href="css/register_step1.css"/>
    <script type="text/javascript" src="js/jquery.js"></script>
</head>
<body>
    <div class="top">
        <p>快速注册</p>
    </div>
    <div class="bottom">
        <p class="input"><input id="phoneNum" placeholder="请输入手机号" onkeyup="checkInput()"></p>
        <p class="input"><input id="passWord" type="passWord" placeholder="请输入验证码" onkeyup="checkInput()"><input id="zphone" type="button" value="获取验证码 " onclick="sendcode(this)" class="zphone"></p>
        <p class="btn_next"><span>下一步</span></p>
    </div>
</body>

</html>
<script type="text/javascript">
    $(".btn_next").click(function(){
        if($(".btn_next").hasClass("active")){
            vailPhone();
        }
           
    });
    
   function checkInput(){
        var phoneNum=$("#phoneNum").val();
        var passWord=$("#passWord").val();
        if (phoneNum && passWord) {
            $(".btn_next").addClass("active");
        }else{
            $(".btn_next").removeClass("active");
        }
   }
   //验证手机号
    function vailPhone(){
      var phone = $("#phoneNum").val();
      var passWord=$("#passWord").val();
      var flag = false;
      var message = "";
      // var myreg = /^(((13[0-9]{1})|(14[0-9]{1})|(17[0]{1})|(15[0-3]{1})|(15[5-9]{1})|(18[0-9]{1}))+\d{8})$/;   
      var myreg =/^1([358][0-9]|4[579]|66|7[0135678]|9[89])[0-9]{8}$/ ;   
      if(phone == ''){
        message = "手机号码不能为空！";
      }else if(phone.length !=11){
        message = "请输入有效的手机号码！";
      }else if(!myreg.test(phone)){
        message = "请输入有效的手机号码！";
      }else if(passWord== ''){
        message = "验证码不能为空！";
      }else{
          flag = true;
      }
      if(!flag){
        //提示错误效果
        alert(message);
      }else{
       //正确后发送请求
         $(".btn_next").click(function(){
             window.location.href="register_step2.html";
         });
        
      }
      return flag;
    }
    function sendcode(o){
      var code=$.trim($('#passWord').val());
      countdown(o);
      // $.ajax({
      //   url:'/index.php?m=Mobile&c=User&a=send_validate_code&t='+Math.random(),
      //   type:'post',
      //   dataType:'json',
      //   data:{code:code},
      //   success:function(res){
      //     if(res.status==1||res.status==0){
      //       countdown(o);
      //     }else{
      //       alert(res.msg);
      //     }
      //   }
      // })
      
    }

    var wait = 60;
    function countdown(obj, msg) {
      obj = $(obj);
      if (wait == 0) {
        obj.removeAttr("disabled");
        obj.val(msg);
        wait = 150;
      } else {
        if (msg == undefined || msg == null) {
          msg = obj.val();
        }
        obj.attr("disabled", "disabled");
        obj.val(wait + "秒后获取");
        wait--;
        setTimeout(function() {
          countdown(obj, msg)
        }, 1000)
      }
    }
</script>